var TeamWebsite = {
	speed: 200,
	//isRetina: false,
	//isTouchDevice: false,
	heroDisplayed: false,
	projectsDisplayed: false,
	teamDisplayed: false,
	menuExpanded: true,
	images: [],
	
	init: function() {
		//this.isRetina = (window.devicePixelRatio > 1 || (window.matchMedia && window.matchMedia("(-webkit-min-device-pixel-ratio: 1.5),(-moz-min-device-pixel-ratio: 1.5),(min-device-pixel-ratio: 1.5)").matches));
		//this.isTouchDevice = (navigator.userAgent.match(/(iPod|iPhone|iPad|Android)/) == null) ? false : true;
		this.images = [
			'general/logo.png', 'general/logo-acux.png','index/banners/hero.jpg', 'index/banners/dashboard.jpg','index/banners/kittens.jpg',
			'index/resources/icon-working-with-ux.png','index/resources/icon-ux-reviews.png','index/resources/icon-noogler-onboarding.png','index/resources/icon-email-lists.png',
			'index/projects/merchant.png', 'index/projects/gsx.png', 'index/projects/more.png', 'index/projects/pla.png', 'index/projects/property.png','index/projects/trust.png',
		    'index/members/adam-bursey.jpg', 'index/members/adnan-virk.jpg', 'index/members/alley-rutzel.jpg','index/members/antonia-mora.png','index/members/ben-dupont.jpg',
		    'index/members/rani-manoharan.jpg','index/members/dan-barritt.jpg','index/members/david-tabb.jpg','index/members/ed-monterrubio.jpg','index/members/ella-musina.jpg',
		    'index/members/geoff-barnes.jpg','index/members/irene-lee.jpg','index/members/jack-dille.jpg','index/members/jakob-marti.jpg','index/members/janice-park.jpg',
		    'index/members/kate-whelan.jpg','index/members/ratna-desai.jpg','index/members/rebecca-gunthrie.jpg','index/members/richard-law.jpg', 'index/members/rocky-medure.jpg',
		    'index/members/ryan-kim.jpg','index/members/tj-musser.jpg','index/members/vicki-tran.jpg','index/members/allison-rung.png', 'index/members/margo-stern.png', 
		    'index/members/will-koehler.png', 'index/members/beverly-freeman.png'
		    // 'index/members/alex-sciuto.jpg','index/members/robert-surrency.jpg',
		];
		
		// site initiation elements
		this.website = $(window);
		this.body = $('body');
		this.loader = $('#loader');
		this.preloader = $('#preloader');
		
		// menu elements
		this.menu = $('#menu');
		this.menuBg = $('#menuBg');
		
		// sections as elements
		this.sectionHero       = $('#hero');
		this.sectionProjects   = $('#projects');
		this.sectionPrinciples = $('#principles');
		this.sectionResources  = $('#resources');
		this.sectionResearch   = $('#research');
		this.sectionTeam       = $('#team');
		this.sectionCurrent    = null;
		
		// section anchors
		this.anchorHero       = $('#heroAnchor');
		this.anchorProjects   = $('#projectsAnchor');
		this.anchorPrinciples = $('#principlesAnchor');
		this.anchorResources  = $('#resourcesAnchor');
		this.anchorResearch   = $('#researchAnchor');
		this.anchorTeam       = $('#teamAnchor');
		
		// launching routines
		this.setDimensions();
		this.preloadImages();
	},
	
	setDimensions: function() {
		this.body.height(this.website.height());
		this.body.width(this.website.width());
	},
	
	preloadImages: function() {
		var preload = function(path, images, preloader) {
		    $(images).each(function() {
		        $('<img />').attr('src', path+this).appendTo(preloader);
		    });
		};
		
		preload('img/', this.images, this.preloader);
		
		var imagesToLoad = $('#preloader img'), 
			imagesCount  = imagesToLoad.length,
			loadedCount  = 0, 
			loadedDelay  = -1;
			
		// count preloaded images and act upon that	
		this.website.on('imagePreloaded', function(){
	    	loadedCount++;	
		    if (imagesCount == loadedCount){
		    	TeamWebsite.analyzeURL();
		    	setTimeout(function(){
		    		$('#loader').remove();	         	
                    TeamWebsite.preloader.remove();
                    TeamWebsite.loader.remove();
                    TeamWebsite.animateSectionInView();
                    TeamWebsite.observe();
		       	}, TeamWebsite.speed);
		    }
		});
		
		// load images and fire custom event
		imagesToLoad.each(function(index){
			if ($(this)[0].complete){
				loadedDelay++;
				setTimeout(function(){
					$(this).trigger('imagePreloaded');
	      		}, loadedDelay * 30);
			} else {
				$(this).on('load', function(){
					loadedDelay++;
					setTimeout(function(){
						TeamWebsite.website.trigger('imagePreloaded');         
	 			}, loadedDelay * 30);
				}).attr('src', $(this).attr('src'));
			}
	  	});
	},
	
	analyzeURL: function(){
		var anchor = document.URL.split('#')[1];
		if (anchor !== undefined) {
			var section = document.getElementById(anchor);
			if (section && section.tagName == 'SECTION') {
				var nextSection = $('#' + anchor);
				var nextAnchor  = $('#' + anchor + 'Anchor');
								
				if (nextAnchor) {
					console.log('transition to the next anchor / section');
					$('html,body').animate({scrollTop: nextAnchor.offset().top}, this.speed/2, function(){
						$('html,body').clearQueue();
					});
					this.menuToggle();
				}
								
				if (nextSection) {					
					this.updateNavigation(nextSection);
				}
			}		
		} 
	},
	
	updateNavigation: function(section) {
		var sectionId = "#" + section.attr('id');
		if (this.sectionCurrent !== section.attr('id')) {
			this.sectionCurrent = sectionId;
		}
	},
	
	menuCollapse: function() {
		if (this.menuExpanded) {
			TweenMax.to($(this.menu), 0.4, { y: -44, ease: "cubic-bezier(0.4, 0.0, 0.2, 1)" });
			TweenMax.to($(this.menuBg), 0.4, { y: -70, ease: "cubic-bezier(0.4, 0.0, 0.2, 1)", onComplete: function(){
				TeamWebsite.menuExpanded = false;
			} });
		}
	},
	
	menuExpand: function() {
		if(!this.menuExpanded) {
			TweenMax.to($(this.menu), 0.4, { y: 0, ease: "cubic-bezier(0.4, 0.0, 0.2, 1)" });
			TweenMax.to($(this.menuBg), 0.4, { y: 0, ease: "cubic-bezier(0.4, 0.0, 0.2, 1)", onComplete: function() {
				TeamWebsite.menuExpanded = true;
			} });
		}
	},
	
	menuToggle: function() {
		var scrollTop = $(this.website).scrollTop();
		if (scrollTop > 0 || scrollTop == undefined) {		
			this.menuCollapse();
		} else if (scrollTop < ($(this.website).height())) {
			this.menuExpand();
		} 
	},
	
	observe: function() {
		this.website.on('resize', function(){ 
			TeamWebsite.setDimensions(); 
		});
		
		this.body.niceScroll({
			autohidemode: true,
			zindex: 1000,
			cursorborder: 0,
			cursoropacitymax: 0.5,
			horizrailenabled: false,
			railpadding: {top:0,right:2,left:0,bottom:0},
			scrollspeed: 100,
			touchbehavior: true,
			cursordragontouch: true,
			grabcursorenabled: false,
			hwacceleration: true,
			preservenativescrolling: true,
			mousescrollstep: 40,
			cursorwidth: 10,
			cursorcolor: "#444444",
			background: "transparent",
			bouncescroll: true
		});
		
		$('.navbar-brand').fastClick(function(e){
			e.preventDefault();
			e.stopPropagation();
			$('html,body').animate({
				scrollTop: 0
			}, TeamWebsite.speed*4, function(){ 
				$('html,body').clearQueue(); 
				window.location.hash = "#hero";
			});
		});
		
		$('#nav a').fastClick(function(e){
			e.preventDefault(); 
			e.stopPropagation();
			var nextSectionID = $(this).attr('href');
			var nextSection   = $(nextSectionID);		
			var nextAnchor    = $(nextSectionID + "Anchor");
			
			TeamWebsite.updateNavigation(nextSection);
			
			$('html,body').animate({
				scrollTop: nextAnchor.offset().top
			}, TeamWebsite.speed*4, function(){ 
				$('html,body').clearQueue(); 
				window.location.hash = nextSectionID;
			});
		});
		
		// animate expand/collapse top header menu on scroll
		this.website.on('resize scroll', function(){
			var scrollTop = TeamWebsite.website.scrollTop();			
			if (scrollTop >= TeamWebsite.anchorHero.offset().top && scrollTop < TeamWebsite.anchorProjects.offset().top) {
				TeamWebsite.menuExpand();
			} else if (scrollTop >= TeamWebsite.anchorProjects.offset().top) {
				TeamWebsite.menuCollapse();
			}
		});
		
		
		// animate slogan on the hero banner
		this.sectionHero.bind('inview', function(event, isInView, visiblePartX, visiblePartY){			
			if (!TeamWebsite.heroDisplayed) {						
				TeamWebsite.heroDisplaed = true;
				TeamWebsite.animateHero();
			}	
		});
		
		// animate project boxes to float upwards from invisible to visible
		this.sectionProjects.bind('inview', function(event, isInView, visiblePartX, visiblePartY){
			if (isInView) {
				if (visiblePartY == 'top') {
					console.log('projects are in view from top');
					if (!TeamWebsite.projectsDisplayed) {
						TeamWebsite.projectsDisplayed = true;
						TeamWebsite.animateProjects();
					}
				} else if (visiblePartY == 'bottom') {
					console.log('projects are in view from bottom');
					if (!TeamWebsite.projectsDisplayed) {
						TeamWebsite.projectsDisplayed = true;
						TeamWebsite.animateProjects();
					}
				} 
			}	
		});
		
		// animate user photos from invisible to visible floating upwards
		this.sectionTeam.bind('inview', function(event, isInView, visiblePartX, visiblePartY){
			if (isInView) {
				if (visiblePartY == 'top') {
					if (!TeamWebsite.teamDisplayed) {
						TeamWebsite.teamDisplayed = true;
						TeamWebsite.animateTeam();
					}
				} else if (visiblePartY == 'bottom') {
					if (!TeamWebsite.teamDisplayed) {
						TeamWebsite.teamDisplayed = true;
						TeamWebsite.animateTeam();
					}
				} 
			}	
		});

	},
	
	// if section is in view, animate particular section content,
	// this can carry out any anumation you wish when slide is in view...
	animateSectionInView: function() {
		var scrollTop = $(this.website).scrollTop();
		if (scrollTop >= $(this.anchorHero).offset().top && scrollTop < $(this.anchorProjects).offset().top) {
			console.log('section: hero');
			this.animateHero();				
		} else if (scrollTop >= $(this.anchorProjects).offset().top && scrollTop < $(this.anchorPrinciples).offset().top) {	
			console.log('section: projects');
			this.animateProjects();									
		} else if (scrollTop >= $(this.anchorPrinciples).offset().top && scrollTop < $(this.anchorResources).offset().top) {	
			console.log('section: principles');		
		} else if (scrollTop >= $(this.anchorResources).offset().top && scrollTop < $(this.anchorResearch).offset().top) {
			console.log('section: resources');				
		} else if (scrollTop >= $(this.anchorResearch).offset().top && scrollTop < $(this.anchorTeam).offset().top) {
			console.log('section: research');				
		} else if (scrollTop >= $(this.anchorTeam).offset().top) {
			console.log('section: team');	
			this.animateTeam();			
		}
	},
	
	animateHero: function() {
		TweenMax.staggerTo(['#sloganTitle', '#slogan'], 0.4, { opacity: 1, scale: 1, x: 0, y: 0, ease: "cubic-bezier(0.0, 0.0, 0.2, 1)" }, 0.2);
	},
	
	animateProjects: function() {
		window.setTimeout(function(){
			TweenMax.to(".project-item", 0.6, { x: 0, y: 0, opacity: 1, ease: "cubic-bezier(0.0, 0.0, 0.2, 1)" });	
		}, TeamWebsite.speed * 3 / 4);
	},

	animateTeam: function() {
		window.setTimeout(function(){
			TweenMax.to(["#fig-1-1", "#fig-1-4", "#fig-2-2", "#fig-2-5", "#fig-4-1", "#fig-3-3", "#fig-3-6", "#fig-4-4", "#fig-5-1", "#fig-5-4"], 0.4, { y: 0, opacity: 1, ease:Power4.easeOut });		
			TweenMax.to(["#fig-1-2", "#fig-1-5", "#fig-2-1", "#fig-2-3", "#fig-2-6", "#fig-3-2", "#fig-3-4", "#fig-4-3", "#fig-4-5", "#fig-5-2", "#fig-5-5"], 0.4, { delay: 0.1, y: 0, opacity: 1 });		
			TweenMax.to(["#fig-1-3", "#fig-1-6", "#fig-2-4", "#fig-3-1", "#fig-3-5", "#fig-4-2", "#fig-4-6", "#fig-5-3", "#fig-5-6"], 0.4, { delay: 0.2, y: 0, opacity: 1});
		}, TeamWebsite.speed * 3 / 4);
	},

};

$(document).ready(function(){	
	TeamWebsite.init();
});